<template>
  <div class="error-page">
    <h1>501 - 错误页面</h1>
    <p>{{ errorMsg }}</p>
    <router-link to="/login">返回登录</router-link>
  </div>
</template>

<script setup lang="ts">
import { useRoute } from "vue-router";
import { computed } from "vue";

const route = useRoute();
const errorMsg = computed(() => decodeURIComponent((route.query.msg as string) || "未知错误"));
</script>

<style scoped>
.error-page {
  max-width: 480px;
  margin: 80px auto;
  padding: 32px;
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  text-align: center;
}
h1 {
  color: #d9534f;
  margin-bottom: 16px;
}
p {
  color: #666;
  margin-bottom: 24px;
}
</style>
